<!--  -->
<template>
<div>
   <search>
    <span class="search_span">重置登录密码</span>
   </search>
  <div class="title">
    <div class="regisinfo">

      <!-- 修改密码 -->
  
  <van-form @submit="btnSubmit">
  <van-field
    v-model="data.pwd"
    name="密码"
    label="密码"
    left-icon="bag"
    placeholder="密码"
    :rules="[{ required: true, message: '请填写密码' }]"
  />
  <van-field
    v-model="data.qurPwd"
    type="password"
    name="密码"
    left-icon="bag"
    label="密码"
    placeholder="密码"
    :rules="[{ required: true, message: '请确认密码' }]"
  />
  <div style="margin-top: 46vw;margin-left: 6vw;width:75vw">
    <van-button round block type="info" color= "#dcb884" native-type="submit">确定</van-button>
  </div>
</van-form>
    </div>
  </div>
  </div>
</template>
<script>
import search from "@/components/search/search.vue";
import { Toast } from "vant";
import {EditRegPwd} from "@/network/register/register.js";
import { ContactList } from "vant";
export default {
  components:{
       search
  },
  data() {
    return {
      data:{
        pwd:'',
        qurPwd:''
      },
      userInfo:{}
    };
  },
  methods: {
    //点击修改
    async btnSubmit() {
      if(this.data.pwd==this.data.qurPwd){
        this.userInfo.pwd=this.data.pwd
        const res= await EditRegPwd({data: JSON.stringify(this.userInfo),})
        Toast.success("修改成功");
        this.$router.back()
      }else{
          Toast.fail("两次密码不一致");
      }
       
    },
  },
  created() {
    this.userInfo=this.$store.state.userInfo
  },
};
</script>
<style lang="less" scoped>
@import "../assets/css/index.less";
@vw: 0.06666vw;

.title {
  display: flex;
  width: 100vm;
  height: 2820 * @vw;
  background-color: #f5f5f5;
  flex-wrap: wrap;
  .regisinfo {
    width: 100vm;
    height: 30vw;
    background-color: #ffffff;
    margin: 100 * @vw auto;
    margin-top: 320*@vw;
    border-radius: 40 * @vw;
    .img {
      width: 100vm;
      display: flex;
      justify-content: center;
      margin: 0 auto;
    }
    .info {
      width: 100vm;
      flex-wrap: wrap;
      margin-left: 20 * @vw;
      margin: 0 * @vw auto;
      .box {
        width: 1383 * @vw;
        height: 217 * @vw;
        display: flex;
        position: relative;
        .icon {
          // float: left;
          top: 3.3331vw;
          margin-left: 20 * @vw;
        }
        .txtinput {
          // width: 1191 * @vw;
          // float: left;
          margin-left: 10 * @vw;
        }
        .btnget {
          background-color: white;
          color: #dcb884;
          border-style: hidden;
        }
      }
    }
  }

  .btnregister {
    width: 1146 * @vw;
    height: 178 * @vw;
    background-color: #dcb884;
    border-style: hidden;
    margin: 100 * @vw 177 * @vw;
  }
}
.colon {
  display: inline-block;
  margin: 0 4px;
  color: #ee0a24;
}
.block {
  display: inline-block;
  width: 22px;
  color: #fff;
  font-size: 12px;
  text-align: center;
  border-radius: 12 * @vw;
  background-color: #ee0a24;
}
.search_span{
  font-size: 6vw;
  
}
</style>